extends layout

block content
  .container
    h1 #{__('Block')}
    .well#block1chain1well
      form.form-horizontal

        .form-group
          label.col-sm-2.control-label(for='block1chain1number') #{__('Block')}:
          .col-sm-10
            .input-group
              span.input-group-addon #
              input#block1chain1number.form-control(type='number', value='1')

        .form-group
          label.col-sm-2.control-label(for='block1chain1nonce') #{__('Nonce')}:
          .col-sm-10
             input#block1chain1nonce.form-control(type='text', value='72608')

        .form-group
          label.col-sm-2.control-label(for='block1chain1data') #{__('Data')}:
          .col-sm-10
            textarea#block1chain1data.form-control(rows='10')

        #state.form-group
          label.col-sm-2.control-label(for='block1chain1hash') #{__('Hash')}:
          .col-sm-10
            input#block1chain1hash.form-control(type='text', disabled)

        .form-group
          .col-sm-2
            i.icon-spinner.icon-spin.icon-large
          .col-sm-10
            button#block1chain1mineButton.btn.btn-primary.ladda-button(data-style='expand-right')
              span.ladda-label #{__('Mine')}

  script.
    $(function() {
      $('#block1chain1number').bind('input propertychange', function() { updateHash(1, 1); });
      $('#block1chain1nonce').bind('input propertychange', function() { updateHash(1, 1); });
      $('#block1chain1data').bind('input propertychange', function() { updateHash(1, 1); });
      mineButtonAnimation(1, 1);
      updateHash(1, 1);
    });

    function getText(block, chain) {
      return $('#block'+block+'chain'+chain+'number').val() +
             $('#block'+block+'chain'+chain+'nonce').val() +
             $('#block'+block+'chain'+chain+'data').val();
    }

    function mineButtonAnimation(block, chain) {
      $('#block'+block+'chain'+chain+'mineButton').click(function(e) {
          e.preventDefault();
          var l = Ladda.create(this);
          l.start();
          setTimeout(function() {
              mine(block, chain, false);
              l.stop();
            }, 250); // give UI time to update
        });
    }
